<?php $this->load->view("include/meta"); ?>
    <title>登录-打球吧</title>

    <!-- Bootstrap core CSS -->
    <link href="<?php echo site_url();?>assets/css/bootstrap.css" rel="stylesheet">
    <link href="<?php echo site_url();?>assets/css/common.css" rel="stylesheet">
    <link href="<?php echo site_url();?>assets/css/jquery-impromptu.css" rel="stylesheet">

  </head>

  <body class="gray-bg">

    <!-- Wrap all page content here -->
    <div id="wrap">

    <!-- header start -->
    <?php $this->load->view("include/header"); ?> 
    <!-- header end -->

    <div class="container" id="main">
        <div class="row" id="fillin" >
            <div class="col-md-6 col-md-push-6">
                <div class="cool-block">
                    <h3>马上登录</h3>

                    <form role="form" class="form-horizontal">
                        <div class="form-group">
                            <label class="col-lg-2 control-label">帐号</label>
                            <div class="col-lg-10">
                                <input type="email" placeholder="注册的邮箱帐号" id="email" class="form-control" maxLength="50" autocomplete="off" value="<?php echo $this->input->cookie('user') ? $this->input->cookie('user'):''; ?>"/>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-lg-2 control-label">密码</label>
                            <div class="col-lg-10">
                                <input type="password" placeholder="大于六位的密码" id="password" class="form-control" maxLength="30" />
                            </div>
                        </div>

                        <?php if($login_count >= 3) : ?>
                        <div class="form-group" id="captcha">
                            <label class="col-lg-2 control-label">验证码</label>
                            <div class="col-lg-4">
                                <input type="text" class="form-control" name="captcha" maxLength="4" autocomplete="off" /> 
                            </div>
                            
                            <div class="col-lg-5">
                            <img width="80" height="30" src="<?php echo site_url('captcha').'/?t='.microtime(true); ?>"> <a href="javascript:;" id="refresh">换张图</a>
                            </div>
                        </div>
                        <?php endif; ?>

                        <div class="form-group">
                            <div class="col-lg-10 col-lg-offset-2">
                            <input type="checkbox" name="remember" value="1"> 记住帐号 <a href="<?php echo site_url('forget');?>" style="margin-left:20px;">忘记密码？</a>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-lg-offset-2 col-lg-10">
                                <button class="btn btn-info" type="button" id="submit">登录</button>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-lg-offset-2 col-lg-10">
                                <a class="login2register" href="<?php echo site_url('register');?>">还没有帐号？立即注册只需15秒</a>
                            </div>
                        </div>
                    </form>

                    <div class="delimiter" style="display:none;">
                    QQ登录 微博登录
                    </div>
                </div>
            </div>

            <div class="col-md-6 col-md-pull-6">
                <h3>
                组织或加入活动
                </h3>
                <p class="lineheight-25">
                你是否因为在一个孤单的城市中，而感到孤单寂寞。你是否常常有运动的冲动，却因为没有共同玩耍的小伙伴而只能放弃念头。你是否看到隔壁的萌妹子在愉快的玩耍，却不知如何加入。求组队、求活动是否是你内心深处的呐喊。
                </p>

                <ul class="piclist-4">
                    <li><img src="<?php echo site_url();?>assets/images/icons/32/1.png"></li>
                    <li><img src="<?php echo site_url();?>assets/images/icons/32/2.png"></li>
                    <li><img src="<?php echo site_url();?>assets/images/icons/32/3.png"></li>
                    <li><img src="<?php echo site_url();?>assets/images/icons/32/4.png"></li>
                </ul>

                <p class="lineheight-25">
                这里有各种球场高手，切磋球技或者抱高手大腿，任君选择。这里有同样热血的青年，聊技术、聊比赛、聊球队通通奉陪。这里有热爱运动的萌妹子，场边萌妹子场上就是女汉子，个个都耍的有模有样。赶快加入我们吧！大门始终为你打开，快步进入，体验这一切。
                </p>
            </div>

        </div>
    </div>    <!-- end content -->

    </div>    <!-- end wrap -->

    <!-- footer start -->
    <?php $this->load->view("include/footer"); ?> 
    <!-- footer end -->

    <script type="text/javascript" src="<?php echo site_url();?>assets/js/jquery.min.js"></script>
    <script type="text/javascript" src="<?php echo site_url();?>assets/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="<?php echo site_url();?>assets/js/jquery-impromptu.js"></script>
    <script>
    $(function(){

        $("div").data("enable",true);
        $('#submit').bind('click',function(){

            if(!checkForm())
            {
                return false;
            }
        
            if(!$("div").data("enable")) 
            {
                return false;
            }
            else
            {
                $("div").data("enable",false);
                $('#submit').text('提交中...');
            }

            $.ajax({
                url: "<?php echo site_url();?>api/login/",
                type: "POST",
                dataType: "json",
                data: {email:$('#email').val(),password:$('#password').val(),captcha:$('input[name="captcha"]').val(),remember:$('input[name="remember"]:checked').val()},
                success: function(data){

                    if(data.error == 0)
                    {
                        $('#submit').text('登录');

                        if(data.data.next)
                        {
                            window.location.href=data.data.next;
                        }
                        else
                        {
                            window.location.href="<?php echo site_url('user')?>/?uid="+data.data.uid;
                        }
                    }
                    else
                    {
                        $.prompt(data.msg,{
                                buttons: { "确定": true },
                                fitMasker: true
                                });

                        if(data.data && data.data.login_count >= 3 )
                        {
                            if(!$('#captcha').length)
                            {
                                var html = '<div class="form-group" id="captcha"><label class="col-lg-2 control-label">验证码</label><div class="col-lg-4"><input type="text" class="form-control" name="captcha" maxLength="4" /></div><div class="col-lg-5"><img width="80" height="30" src="<?php echo site_url('captcha').'/?t='.microtime(true); ?>"> <a href="javascript:;" id="refresh">换张图</a></div></div>';

                                $('#password').parent().parent().after(html);
                            }
                        }

                        $("div").data("enable",true);
                        $('#submit').text('登录');

                        clearForm(data.error);
                    }
                }
            });
        });

        $('#main').on('click','#refresh',function(){
            timestamp = new Date().getTime(); 
            $('#captcha img').attr('src','<?php echo site_url("captcha")?>/?t='+timestamp);
        });
        
        function checkForm()
        {
            var myReg = /^[\.\-_A-Za-z0-9]+@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/;

            if (!myReg.test($('#email').val())) 
            {
                $.prompt('请填写有效的email帐号',{
                        buttons: { "确定": true },
                        fitMasker: true
                        });
                return false;
            }
            
            if($('#password').val().length < 6)
            {
                $.prompt('密码长度需大于6位',{
                        buttons: { "确定": true },
                        fitMasker: true
                        });
                return false;
            }

            if($('#captcha').length > 0 && $('input[name="captcha"]').val().length < 4)
            {
                $.prompt('请输入4位验证码',{
                        buttons: { "确定": true },
                        fitMasker: true
                        });
                return false;
            }

            return true;
        }

        function clearForm(code)
        {
            switch(code)
            {
                case 2014:
                    break;

                case 4001:

                case 4004:
                    $('#password').val('');
                    break;

            }

            if($('#captcha').length > 0)
            {
                $('input[name="captcha"]').val('');
                $('#refresh').click();
            }
        }


    });
    </script>
    </body>
</html>
